/* ==========================================================================
   Index Page
   ========================================================================== */
/*首页banner大图样式*/
.ibanner{ position:relative; height:788px; overflow: hidden; margin-top: 114px;}
.ibanner .swiper-container {width: 100%;height: 100%;}
.ibanner .swiper-slide { background-repeat:no-repeat; background-position:center center; background-size:cover;text-align: center;font-size: 18px;/* Center slide text vertically */display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center; position:relative;}
.ibanner .swiper-container-horizontal > .swiper-scrollbar{ width:272px; left:251px; bottom:30%;}

.ibanner .ban-img{ display:block; width:100%; height:100%; color:#fff;text-align:left;}
.ibanner .swiper-pagination{ bottom:0rem!important; color: #fff; text-align: left;  box-sizing: border-box; max-width: 255px; background: #0e57c0; min-height: 115px; display: flex; align-items: center;justify-content: center;  right: 0; left: auto;}
.ibanner .swiper-pagination-bullet{background: #ffffff; opacity: 0.5; position: relative; width: 8px; height: 8px; border-radius: 100%;    margin: 0 8px !important;}
.ibanner .swiper-pagination-bullet{ color: transparent; background:#fff;}
.ibanner .swiper-pagination-bullet-active{ opacity: 1; height: 8px;height: 8px;transition: all 0.5s; position: relative;}
.ibanner .swiper-pagination-bullet-active:after{width: 20px; height: 20px; content: ""; display: block; background: rgba(255,255,255,0.6); position: absolute; left: -6px; right: -5px;margin: 0 auto; top: -6px; border-radius: 100%;    opacity: 1;}



/*应用*/
.sect_k1{ background: #ffffff; padding: 7rem 0 0;  z-index: 2;position: relative; }
.sect_k1 .span-w{ width: 20%; float: left; margin-top: 3rem;}
.dot_1{padding: 40px 0; text-align: center;transition: 0.3s all; position: relative; min-height: 30rem;}
.dot_1:hover{ background: #165cc2; transition: 0.3s all; cursor: pointer;}
.dot_1:hover img{  background: #ffffff; border: 2px solid #ffffff; margin-top: 7rem;}
.dot_1:hover p{ color: #ffffff;}
.dot_1:hover img{ background: #ffffff; border: 2px solid #ffffff;}
.dot_1:hover span{ opacity: 1;}
.dot_1 p{ font-size: 3rem; color: #484848; font-weight: bold; text-align: center; padding: 3rem 0;}
.dot_1 span{ font-size: 12rem; opacity: 0;  color: rgba(255,255,255,0.1); position: absolute; left: 0; right: 0; margin: 0 auto; z-index: 1;    font-family: Arial;font-weight: bold;}
.dot_1 img{ border: 2px solid #0e57c0; border-radius: 100%; padding: 30px; position: relative; z-index: 2;}
/*方案*/
.sect_k2{ padding: 0; }
.dot_2{ background: url(../img/pic_1.jpg) no-repeat center; background-size: cover; min-height: 73.3rem; }
.dot_3{ background: url(../img/pic_2.jpg) no-repeat center;  background-size: cover; min-height: 35.7rem; display: flex; align-items: center;justify-content:center; flex-direction: column;}
.dot_4{ background: url(../img/pic_3.jpg) no-repeat center; background-size: cover; min-height: 35.7rem; display: flex; align-items: flex-start;justify-content:center; flex-direction: column; margin-top: 2rem;}

.box_1{ padding:7rem; text-align: center;}
.box_1.ziti{ padding: 0; display: flex; align-items: center;justify-content: center; flex-direction: column; min-height: 35.7rem;}
.box_1 span{ font-size: 2.4rem; color: #5e6884; display: block; }
.box_1 p{ font-size: 4rem; color: #2d2d2d; font-weight: bold; position: relative; padding: 2rem 0;}
.box_1 p:before{ width: 8.3rem; height: 1px; background: #2d2d2d; content: ""; display: block; position: absolute; left: 5%;top: 49%;}
.box_1 p:after{ width: 8.3rem; height: 1px; background: #2d2d2d; content: ""; display: block; position: absolute; right: 5%;top: 49%;}
.box_1 em{ position: relative; font-size: 2.4rem; font-style: normal; color: #2d2d2d; display: block;}
.box_1 a{ width: 100%; max-width: 185px; display: block; background: #0e57c0; border-radius: 30px; padding: 10px 0; text-align: center; color: #ffffff; font-size: 18px; font-weight: 400; margin: 4rem auto;}
.box_1 a i{ font-size: 1.8rem; margin-left: 10px;}

.box_2{ text-align: left;  margin-left: 28rem;}
.box_2 span{ font-size: 2rem; color: #626262; display: block; }
.box_2 p{ font-size: 4rem; color: #2d2d2d; font-weight: bold; position: relative; padding: 2rem 0;}
.box_2 em{ position: relative; font-size: 2.4rem; font-style: normal; color: #2d2d2d; display: block;}
.box_2 a{width: 2.4rem; height: 2.4rem; text-align: center; line-height: 2.4rem; display: block; background: #fc7e24; border-radius: 100%; text-align: center; color: #ffffff; font-weight: 400;  margin: 2rem 0;}
.box_2 a i{ font-size: 1.2rem;}

.box_3{ text-align: left;  margin-left: 6rem;}
.box_3 span{ font-size: 2rem; color: #ffffff; display: block; background: #fc7e24; font-weight: bold; display: inline-block;padding: 8px 15px;border-radius: 30px; }
.box_3 p{ font-size: 4rem; color: #2d2d2d; font-weight: bold; position: relative; padding: 2rem 0;}
.box_3 em{ position: relative; font-size: 2.4rem; font-style: normal; color: #2d2d2d; display: block;}
.box_3 a{width: 2.4rem; height: 2.4rem; text-align: center; line-height: 2.4rem; display: block; background: #474747; border-radius: 100%; text-align: center; color: #ffffff; font-weight: 400;  margin: 2rem 0;}
.box_3 a i{ font-size: 1.2rem;}


/*product*/
.sect_k3{ padding: 6rem 0; }
.prodBox{ width: 100%; position: relative; z-index: 100;}
.prodBox .hd{margin:0 auto; }
.prodBox .hd ul{display: flex; justify-content: center;max-width: 1192px; margin: 0 auto; background: #0e57c0;    border-radius: 35px;}
.prodBox .hd ul li{text-align: center;line-height: 62px;position: relative; z-index: 0;cursor: pointer; overflow: hidden;}
.prodBox .hd ul li p{color: #ffffff; font-size: 2rem; position: relative; padding: 0 24px; z-index:2;}
.prodBox .hd ul li:before{ width: 100%; height: 100%; position: absolute; border-radius: 35px; opacity: 0; left: 0; bottom: 0; content: ""; background: #f96a18; z-index: 0;}
.prodBox .hd ul li.on::before, .prodBox .hd ul li:hover::before{opacity: 1; left: 0;}
.prodBox .hd ul li.on p{ color: #ffffff; cursor: pointer;}


.img-box{ margin-bottom: 0rem; }
.img-box .icon img{ width: 100%; height: 100%;}
.img-box a{position: relative; padding-top: 2rem;transition: all 0.8s;}
.img-box a:hover .icon img{transform:scale(1);}
.img-box:hover p{ background: #0e57c0; color: #ffffff !important;}
.img-box .ntit{margin: 0 auto; text-align: center; border: 1px solid #dedede; border-top: none;}
.img-box .ntit p{ color: #3a3a3a; font-weight: bold; font-size: 18px; padding: 15px 10px;}



.sect_k4{ margin: 4rem 0; padding: 10rem 0 6rem; background: url(../img/bg_ys.jpg) no-repeat center; background-size: cover;}
.tit_2{ text-align: left; color: #ffffff;}
.tit_2 span{ font-size: 4.8rem; font-weight: bold;}
.tit_2 p{ font-size: 2rem; color: #ffffff;}
.container {display: flex; width: 100%; box-sizing: border-box; margin-top:12rem; clear: both; overflow: hidden;}
.container .box:first-child .b_right{ background: url(../img/pic_5.jpg) no-repeat center top; background-size: cover;}
.container .box:nth-child(2) .b_right{ background: url(../img/pic_51.jpg) no-repeat center top; background-size: cover;}
.container .box:nth-child(3) .b_right{ background: url(../img/pic_52.jpg) no-repeat center top; background-size: cover;}
.container .box:nth-child(4) .b_right{ background: url(../img/pic_53.jpg) no-repeat center top; background-size: cover;}
.container .box:nth-child(5) .b_right{ background: url(../img/pic_54.jpg) no-repeat center top; background-size: cover;}
.box {flex: 1;transition: .5s; color: #ffffff; line-height: 0;  position: relative; transition: all 0.4s; height: 52rem;}
.box .b_left{ width: 100%; float: left; padding-top: 6rem; height: 100%;}
.box .b_left em{ font-size: 4rem; font-weight: bold; font-style: normal; position: relative;  padding-bottom: 15px; display: block; text-align: center; padding-bottom: 6rem;}
.box .b_left em:after{ width:  40%; background: #ffffff; height: 2px; display: block; content: ""; position: absolute; left: 0; right: 0; margin: 0 auto;top: 34px;}
.box .b_left div{ writing-mode: tb-rl;margin: 0 auto;}
.box .b_left div img{ float: left;}
.box .b_left div p{line-height: 4rem;}
.box .b_left div p span{font-size: 14px; opacity: 0.5;}
.box .b_left div p b{ font-size: 3.6rem; color: #ffffff; font-weight: normal;}

.box .b_right { background: url(../img/pic_5.jpg) no-repeat center top; padding-bottom: 10rem; opacity: 0; text-align: left; width:0; margin: 0 auto;  color: #ffffff; transition: all 0.4s ease; background-size: cover; height: 100%;}
.box .b_right p{ font-size: 18px; font-weight: normal; line-height: 2; padding: 4rem;}

.box:hover,.active{ flex: 1 1 30%; cursor: pointer;}
.active .b_left{ opacity: 1; width: 25%; transition: all 0.4s ease; background: #0359c8;}
.active .b_right{ opacity: 1; width: 75%; transition: all 0.4s ease; cursor: pointer; float: right;}
.sect_k4 .top{ border-top:1px solid rgba(255,255,255,0.4);}
.sect_k4 a.more1{ background: #fc7e24; color: #ffffff; font-size: 16px; padding: 15px 30px;display: block; margin-top: 6rem; max-width: 140px; margin-left: auto;}
.sect_k4 a.more1 i{ color: #ffffff; font-size: 2rem; margin-left: 5px;}
.box_4{ color: #ffffff; margin-top: 5rem;}
.box_4 img{ float: left;margin-right: 15px;}
.box_4 div{ color: #ffffff; }
.box_4 div span{ font-size: 3rem; font-weight: bold;}
.box_4 div p{ color: #98aec1; font-size: 18px;}
.box_4 div p a{color: #98aec1;}

.sect_k5{ padding: 10rem 0;}
.box_5{}
.box_5 em{ color: #ffffff; background: #0e57c0; display: block; padding: 8px 15px; max-width: 214px; text-align: center; font-style: normal;}
.box_5 span{ font-size: 4.5rem; color: #333333; padding: 4rem 0; display: inline-block;}
.box_5 p{ font-size: 16px; color: #6c6c6c; line-height: 2;}
.box_6{background: url(../img/pic_map.jpg) no-repeat center bottom; min-height: 66rem; background-size: contain;}
.box_6 .b_1{padding: 8rem 0 0 53%; position: relative;}
.box_6 .b_2{ background: #0e57c0; border-radius: 15px; padding: 2rem 4rem; max-width: 350px; position: relative; margin: 9rem 0 0 12%;}
.box_6 .b_2 div{ color: #ffffff; font-size: 2.4rem; border-bottom: 1px solid rgba(255,255,255,0.2); padding-bottom: 10px; margin-bottom: 10px;}
.box_6 .b_2 div i{ margin-right: 10px;}
.box_6 .b_2 li{ color: #ffffff; font-size: 14px; line-height: 2;padding-left: 4%;}
.box_6 .b_2 li i{ font-size: 20px; margin-right: 5px;}
.box_6 .b_2 li a{ color: #ffffff; font-size: 14px;}

.digital{width: 100%; margin-top: 4rem;border-top: 1px dashed #dedede; padding-top: 4rem;}
.mumping_mun li{width: 24%;display: inline-block;text-align: center;}
.mun_top{ display: flex; justify-content: center;}
.mumping_mun{ list-style: none;}
.mumping_mun p{font-size: 16px; display: block;clear: both; color: #000000;}
.mumping_mun h2{font-size: 4.5rem;font-weight: normal;margin-right: 10px; color: #0e57c0; font-family: impact;}
.mumping_mun span{ font-size: 16px; color: #847460;}

.dot_5{ max-width: 95%;}
.dot_5:hover { cursor: pointer;}
.dot_5:hover .d_2{ background: #0e57c0;}
.dot_5:hover .d_1{ background: #0e57c0; border: 2px solid #ffffff;}
.dot_5:hover .d_1 img{ filter: grayscale(100%) brightness(400%);}
.dot_5:hover .d_2 span{ color: #ffffff;}
 .dot_5:hover .d_2 p{ color: #b5ccee;}
.dot_5 .d_1{border: 1px solid #e6e6e6; margin: 0 auto; border-radius: 100%; max-width: 7.7rem; height: 7.7rem; line-height: 7.7rem;  background: #ffffff; text-align: center; z-index: 2; position: relative;}
.dot_5 .d_1 img{ width: auto;}
.dot_5 .d_2{ position: relative; border: 1px solid #e6e6e6; padding: 5rem 3rem; margin-top: -3rem; z-index: 0; background: #ffffff; text-align: center;-moz-box-shadow:0px 0px 9px #D4D4D4; -webkit-box-shadow:0px 0px 9px #D4D4D4; box-shadow:0px 0px 9px #D4D4D4;} 
.dot_5 .d_2 span{ font-size: 2rem; font-weight: bold; color: #0e57c0;}
.dot_5 .d_2 p{ font-size: 14px; line-height: 30px; padding-top: 1rem; min-height: 15rem;}

.sect_k6{ padding: 10rem 0; background: #f7f7f7; overflow: hidden;}
.prodBox1{ width: 100%; position: relative; z-index: 100;}
.prodBox1 .hd{margin:0 auto; }
.prodBox1 .hd ul{display: flex; justify-content: center;max-width: 1192px; margin: 0 auto; }
.prodBox1 .hd ul li{text-align: center;line-height: 40px;position: relative; background: #0e57c0; border-radius: 35px; margin: 0 15px; z-index: 0;cursor: pointer; overflow: hidden;}
.prodBox1 .hd ul li p{color: #ffffff; font-size: 2rem; position: relative; padding: 0 24px; z-index:2;}
.prodBox1 .hd ul li:before{ width: 100%; height: 100%; position: absolute; border-radius: 35px; opacity: 0; left: 0; bottom: 0; content: ""; background: #f96a18; z-index: 0;}
.prodBox1 .hd ul li:hover::before{opacity: 1; left: 0;}
.prodBox1 .hd ul li.on p{ color: #ffffff; cursor: pointer;}


.img-box1{ margin-bottom: 0rem; }
.img-box1 .icon img{ width: 100%; height: 100%; object-fit: cover;}
.img-box1 a{position: relative; padding-top: 2rem;transition: all 0.8s;}
.img-box1 a:hover .icon img{transform:scale(1.2);}
.img-box1:hover .ntit{ background: #0e57c0; }
.img-box1:hover .ntit span{color: #ffffff;}
.img-box1:hover .ntit p{color: #ffffff;}
.img-box1:hover .ntit b{color: #ffffff;}
.img-box1 .ntit{margin: 0 auto; text-align: center; background: #ffffff; padding: 3rem 0;}
.img-box1 .ntit span{font-size: 2.4rem; font-weight: bold; color: #333333;}
.img-box1 .ntit p{ color: #6a6a6a; font-size: 16px; padding: 15px 10px;}
.img-box1 .ntit b{ border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; display: inline-block; min-width: 150px; font-size: 14px; color: #6a6a6a; padding: 10px; font-size: 14px; margin: 3rem 0 0; font-weight: normal;}

.iprev4{ background: #4e6470; border-radius: 100%; width: 6rem; height: 6rem; display: block; line-height: 6rem; text-align: center;}
.iprev4 i{ color: #ffffff; font-size: 3rem;}
.inext4{ background: #4e6470; border-radius: 100%; width: 6rem; height: 6rem; display: block; line-height: 6rem; text-align: center;}
.inext4 i{ color: #ffffff; font-size: 3rem;}
.swiper-button-prev{ left: 0; top: 30%;}
.swiper-button-next{ right: 0; top: 30%;}

a.more2{ position: relative; max-width: 180px; display: block; text-align: center; margin: 5rem auto; color: #4e6470; border: 1px solid #4e6470; height: 4.6rem; line-height: 4.6rem; font-size: 18px;}
a.more2 i{ font-size: 18px;}
a.more2:hover{ background: #4e6470; color: #ffffff;}
a.more2:before{ width: 300%; height: 2px; background: #efefef; display: block; content: "";     right: 115%;top: 49.5%; position: absolute;}
a.more2:after{ width: 300%; height: 2px; background: #efefef; display: block; content: "";     left: 115%;top: 49.5%; position: absolute;}


.img-box2{ margin-bottom: 0rem; border: 1px solid #dedede; }
.img-box2 .icon img{ width: 100%; height: 100%;}
.img-box2 a{position: relative; transition: all 0.8s;}
.img-box2 a:hover .icon img{transform:scale(1.2);}

.sect_k7{ padding: 10rem 0; background: url(../img/bg_news.jpg) no-repeat center; background-size: cover; }

.tit_3{ text-align: left;}
.tit_3 span{ font-size: 4.8rem; font-weight: bold;}
.tit_3 p{ font-size: 2rem; color: #626262;}

.pusb{ margin-left: auto; display: flex; justify-content:space-around; line-height: 30px; color: #333333;background: #f0f1f3; max-width: 424px; border-radius: 25px;}
.pusb li{ width: 33.3%; text-align: center; padding: 5px 0;}
.pusb li a{ font-size: 16px; color: #5a5a5a;}
.pusb li:hover{ background: #0e57c0;border-radius: 25px;}
.pusb li:hover a{ color: #ffffff;}


.news-box{  position: relative; transition: all 0.6s; background: #f7f7f7;-moz-box-shadow:0px 0px 9px #f2f2f2; -webkit-box-shadow:0px 0px 9px #f2f2f2; box-shadow:0px 0px 9px #f2f2f2;}
.news-box li{  padding: 3rem; border-bottom: 3px solid #dddddd;}
.news-box li:nth-child(3){ border-bottom: none;}
.news-box li a{display: flex; justify-content: space-around; align-items: center;}
.news-box li div{ width: 90%;}
.news-box li div b{ font-size: 14px; color: #9a9a9a; font-weight: normal;}
.news-box li div span{ font-size: 14px; color: #666565;}
.news-box li div p{ font-size: 18px; color: #000000; padding: 10px 0;overflow: hidden;
 white-space: nowrap;text-overflow: ellipsis;}
.news-box li i{ width: 10%; max-width: 31px; height: 31px; line-height: 31px; color: #8d8d8d; border-radius: 100%;  text-align: center; border: 1px solid #dedede;}
.news-box li:hover i{ background: #0e57c0; color: #ffffff;}
.news-box li:hover{ background: #ffffff;}


.img-box3{ margin-bottom: 0rem; }
.img-box3 .icon img{ width: 100%; height: 100%;}
.img-box3 a{position: relative; transition: all 0.8s;}
.img-box3 a:hover .icon img{transform:scale(1.2);}

.img-box3:hover .ntit span{color: #0e57c0;}
.img-box3:hover .ntit p{color: #0e57c0;}
.img-box3:hover .ntit b{color: #0e57c0;}
.img-box3 .ntit{margin: 0 auto; text-align: left; padding:2rem 0;}
.img-box3 .ntit span{font-size: 18px; color: #000000; overflow: hidden;text-overflow: ellipsis; white-space: nowrap; display: block;}
.img-box3 .ntit p{ color: #666565; font-size: 14px; padding: 5px 10px 0 0; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis;
display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.img-box3 .ntit b{font-size: 14px; color: #9a9a9a; font-weight: normal;}
.img-box3 .ntit i{ width: 31px; display: inline-block; height: 31px; line-height: 31px; color: #8d8d8d; border-radius: 100%;  text-align: center; border: 1px solid #dedede; margin-top: 2rem;}